
import { ref, defineComponent, reactive } from 'vue'

export default function useStudents(){
    let studentState = reactive({
        student: {
            id: "",
            name: "",
            age: ""
        }
    });

    let studentsState = reactive({
        students: [
            {id: "1", name: "jsz", age: "10"}
        ]
    });

    function addStudent(e:MouseEvent){
        e.preventDefault();
        const student = Object.assign({}, studentState.student);
        studentsState.students.push(student);
        studentState.student.id = "";
        studentState.student.name = "";
        studentState.student.age = "";
    }
    
    return { studentState, studentsState, addStudent }
}